<template>
	<view>
		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">订阅确认</block>
		</cu-custom>
		<view class="gendan_content uni-column">		
			<view class="gendan_text uni-column">
				<view class="gendan_scop uni-column">
					<view class="gendan_title">
						订阅范围
					</view>
					<view class="gendan_scop_content">
						本次订阅范围包含【eos君】的Okex实盘【eos君】的Bybit实盘 【eos君】的圈子。订阅期间如范围发生变更，将以更新后范围为准。
					</view>
				</view>
				<view class="gendan_nend_know uni-column">
					<view class="gendan_title">
						订阅须知 
					</view>
					<view class="gendan_scop_content">
						<p>充值须知：老版本用户支付单位为积分，新版本已统一为贝壳。1贝壳等于10积分，用户更新到新版后将自动把积分兑换为等值贝壳显示，请知悉。</p>
						
						<p>1.本圈子由圈主自行创建，付费前请详细了解该圈子内容并确认风险，币coin平台不提供相关担保，若发现违法违规信息，请勿加入，并向币coin小助手投诉。</p>
						
						<p>2.圈子服务为虚拟商品，购买后不接受退贝壳服务，购买即代表同意遵守此规则。</p>
						
						<p>3.加入成功后，您可以使用当前手机号注册的币coin账号访问圈子。</p>
						
						<p>4.本圈为付费圈子，当前阶段收费标准为88贝壳/月。老版本用户界面可能为显示88贝壳/月，支付88贝壳订阅的实际周期为月，请放心订阅。</p>
						
						<p>5.当前圈子每次最多可续订12月，且只支持在到期前90天内续订。</p>
					</view>
				</view>
			</view>	
			<view class="gendan_typelist">
				<view class="gendan_type_box uni-column">
					<view class="box-head">通过币客币订阅</view>
					<view class="box-btn-wrap uni-row">
						<view class="box-input">
							<view class="input-border">
							<input class="uni-input" type="number" focus placeholder="输入月份订阅" />
							</view>	
							</view>
						
						<view class="box-btn">
							<view class="box-btn-btn">订阅</view>
						</view>						
					</view>
				</view>
				<view class="gendan_type_box uni-column">
					<view class="box-head">通过订阅码订阅</view>
					<view class="box-btn-wrap uni-row">
						<view class="box-input">
							<view class="input-border">
								<input class="uni-input" type="number" focus placeholder="输入订阅码订阅" /> 
							</view>							
						</view>						
						<view class="box-btn">
							<view class="box-btn-btn">订阅</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style>
	view{
		/* border: #000000 1px solid; */
	}
	
	.gendan_content{
		background-color: #F1F1F1;
		height: 93vh;
		justify-content:space-between
	}
	
	.gendan_text{
		height: 61vh;
		background-color: #FFFFFF;
	}
	
	.gendan_title{		
		display: inline-flex;
		font-size: 35upx;
		align-items: center;
		justify-content: center;
		font-weight: 300;
	}
	
	.gendan_scop_content p{
		font-size: 0.6rem;
	}
	.gendan_scop_content{
		font-size: 0.6rem;
		/* line-height: 40upx; */
		padding: 10upx;
	}
	
	.gendan_scop{
		height: 25%;
		display: flex;
	}
	
	.gendan_nend_know{
		height: 75%;		
		display: flex;
	}
	
	.gendan_typelist{
		height: 31vh;		
		background-color: #FFFFFF;
	}
	
	.gendan_type_box{

	}
	
	
	
	.box-head{
		height: 50upx;
		padding-left: 10upx;
		font-size: 0.5rem;
		font-weight: bolder;
		display: inline-flex;
		align-items: center;
	}
	
	.box-input{
		flex: 1;	
		align-items: center;
		justify-content: center;
		display: inline-flex;
		
	}
	
	.input-border{
		width: 70%;
		border: #000000 1px solid;
		border-radius: 5upx;
	}
	
	.uni-input{
		height: 30upx;
		
	}
	
	
	
	.box-btn{
		flex: 1;	
		align-items: center;
		justify-content: flex-end;
		display: inline-flex;
	}
	
	.box-btn-wrap{
		height: 80upx;
	}
	
	.box-btn-btn{		
		align-items: center;
		justify-content: center;
		display: inline-flex;
		width: 160upx;
		background-color: #0069D9;
		color: #FFFFFF;
		border-radius: 20upx;
		margin-right: 40upx;
	}

</style>
